<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('补考得分列表')" />
</head>
<style>
    #content_message{
        height: 80%;
        overflow-y:auto;
        margin-bottom: 5%;
    }
</style>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <input id="userName" th:field="${user.userName}" type="hidden" >
            <input id="receiveNumber" th:value="${receiveNumber}" type="hidden" >
            <input id="courseNumber" th:value="${courseNumber}" type="hidden" >
            <input id="moduleName" th:value="${moduleName}" type="hidden" >

            <div id="content_message" class="col-sm-12 search-collapse" >
                <p th:each="message : ${messages}">
                    <span th:text="${message.submitName}"></span>：
                    <span style='float: right' th:text="${#dates.format(message.submitTime,'yyyy-MM-dd HH:mm:ss')}"></span>
                    <br>
                    <span th:text="${message.content}"></span>
                </p>
            </div>
            <div id="submitMessage" class="row">
                <div class="col-sm-8">
                    <input id="message" type="text" class="form-control">
                </div>
                <div class="col-sm-4">
                    <button class="btn btn-default btn-outline" onclick="sendMessage()">发送</button>
                </div>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
</body>
<script>

    var showContent = $("#content_message");
    showContent[0].scrollTop = showContent[0].scrollHeight;

    function getNow(s) {
        return s < 10 ? '0' + s: s;
    }
    function sendMessage() {
        var message =  $("#message").val();
        if(message == null || message == undefined || message == ""){
            $.modal.msgError("不能为空！");
            return;
        }
        var myDate = new Date();
        var year=myDate.getFullYear();        //获取当前年
        var month=myDate.getMonth()+1;   //获取当前月
        var date=myDate.getDate();            //获取当前日
        var h=myDate.getHours();              //获取当前小时数(0-23)
        var m=myDate.getMinutes();          //获取当前分钟数(0-59)
        var s=myDate.getSeconds();
        var now=year+'-'+getNow(month)+"-"+getNow(date)+" "+getNow(h)+':'+getNow(m)+":"+getNow(s);


        var userName = $("#userName").val();

        showContent.append("<p><span>"+userName+"："+message+"</span><span style='float: right'>"+now+"</span></p>");
        showContent[0].scrollTop = showContent[0].scrollHeight;

        $.ajax({
            type : "post",
            url : ctx + "gas/message/add",
            data : {
                "receiveNumber": $("#receiveNumber").val(),
                "courseNumber": $("#courseNumber").val(),
                "moduleName": $("#moduleName").val(),
                "content": message
            },
            error : function(data) {
                $.modal.alertError("系统错误");
            },
            success : function(data) {
            }
        });

        $("#message").val("");
    }

</script>
</html>